@charset "utf-8";
/* CSS Document */

body { font-family: 'Calibri', sans-serif; color: #FFF; margin: 0; font-size: 1em; background-color: #000; padding: 0; }

.container { width: 500px; margin: 0 auto 0 auto; clear: both; }
.header { width: 100%; height: 150px; margin: 2em auto 3em auto; background-image: url('title.png'); background-repeat: no-repeat; background-position:25px -15px; }
.header > h1 { font-size: 300%; font-family: 'Helvetica', sans-serif; position: relative; top: 1.3em; left: 3.5em; }

.content { width: 480px; min-height: 50%; height: auto; float: right; clear: none; margin-top:1em; padding: 10px; background-color: #222; }
.navigation { width: 490px; padding-right: 0.5em; background-color: #444; }
.navigation > a { height: 1.6em; width: auto; text-align: center; padding: 5px; display: inline-block; text-decoration: none; color: inherit; margin: 0 0 0.2em 0.5em; }
.navigation > a:hover { text-decoration: underline; }
.nav:hover { background-color: #06C; color: #000; }

.content > h1 { font-size: 175%; border:#CCFF00 solid; border-width: 0 0 0 5px; font-weight: normal; text-transform: lowercase; padding-left: 0.5em; margin-left: 0.5em; }
.content > h2 { font-size: 150%; border:#990033 solid; border-width: 0 0 0 5px; font-weight: normal; padding-left: 0.5em; margin-left: 0.75em; }
a { color: #09F; text-decoration: none; }
a:hover { text-decoration: underline; }
.button { background: none; border: none; color: #09F; text-decoration: none; }
.button:hover { background: none; border: none; text-decoration: underline; cursor: pointer; }
.access { width: auto; height: auto; padding: 0.2em; float: right; margin: 0; text-align: right; position: relative; right: 0; top: 2.5em; font-size: 0.8em; }
.access > a { display: inline-block; text-decoration: none; padding:0.3em 1em 0.3em 1em; color: inherit }
.access > a:hover { text-decoration: underline; color: inherit; }
p:first-line { text-indent: 10px; }
p.author { text-align: right; font-style: italic; font-size: 90%; }

map:hover { cursor: pointer; }
.footer { width: 100%; height: auto; color: inherit; clear: both; position: relative; top: 0.5em; margin-bottom: 1.5em; padding: 2px;text-align: right; font-size: 80%; }

img { display: block; clear: none; float: right; }
hr { width: 50%; border-style: dotted; border-width: 1px; margin: 2em auto 2em auto; }

.warn { border: 1px solid #C60; background-color: #C90; -webkit-border-radius: 4px; -moz-border-radius: 4px; padding: 4px; color: #000; margin: 5px; }
.fine { border: 1px solid #0F0; background-color: #6F3; -webkit-border-radius: 4px; -moz-border-radius: 4px; padding: 4px; color: #000; margin: 5px; }
.fail { border: 1px solid #F00; background-color: #903; -webkit-border-radius: 4px; -moz-border-radius: 4px; padding: 4px; color: #000; margin: 5px; }

.bg-colour2 { background-color: #444; }
.fn-colour1 { color: #CCFF00; }
.fn-colour2 { color: #3399FF; }